<template>
    <view style="background-color:#F1F2e5;padding: 10px;">
        <view style="border-radius: 10px;background-color: white;padding: 20px;">
            
            <u-row v-if="addinfo!=null">
                <u-col span="2">
                    <view style="background-color: #1890FF;padding:5px;color:white;width: 21px;">
                        家
                    </view>
                    
                </u-col>
                <u-col span="9">
                    <u-row>
                        {{addinfo.clientEconomize+addinfo.clientCity+addinfo.clientCounty+addinfo.detailedAddress}}
                    </u-row>
                    <u-row style="margin-top: 5px;color: #B39999;">
                        <u-col span=3>
                            {{addinfo.consigneeName}}
                        </u-col>
                        <u-col span="9">
                            {{addinfo.clientPhone}}
                        </u-col>
                    </u-row>
                </u-col>
                    
                <u-col span="1">
                    <u-icon style="font-weight: 900;" name="arrow-right"></u-icon>
                </u-col>
            </u-row>
            <u-row v-else>
                <u-col span="4">
                    
                </u-col>
                <u-col span="4">
                    <u-button style="border-radius: 30px;" @click="toaddadd">添加地址</u-button>
                </u-col>
                <u-col span="4">
                    
                </u-col>
            </u-row>
        </view>
        <view style="border-radius: 10px;background-color: white;padding: 20px;margin-top: 10px;">
            <u-row>
                
                <text style="font-weight: 800;">保证金：</text><text style="color: red;">￥100.00</text>
            </u-row>
            <view style="margin-top: 10px;font-size: 15px  ;color: #666666;">
                1、若竞拍不成功，保证金将全额退还、
            </view>
            <view style="font-size: 15px  ;color: #666666;">
                2、若竞拍成功，保证金小于成交价，将作为抵消最终价格一部分，请在72小时内，支付尾款，逾期未支付将扣除保证金，不予以退款。
            </view>
            
        </view>
        <u-row style="margin-top: 40px;">
            <u-col span="3.5"></u-col>
            <u-col span="5">
                <u-button @click="depositSurety" shape="circle" :custom-style="{backgroundColor:'#d7000f',border:'0px',color:'white'}">支付保证金</u-button>
            </u-col>
            <u-col span="3.5"></u-col>
        </u-row>
        <view style="height: 500px;">
            
        </view>
    </view>
</template>

<script>
    export default {
        data() {
            return {
                userId:1,
                id:1,
                addinfo:{},
            }
        },
        onLoad(op) {
            var that = this
            if(op.id){
                this.id = op.id
            }
            var userId = uni.getStorageSync("loginId")
            if(userId){
                this.userId = userId
            }
            this.getDefaultAdd()
        },
        methods: {
            getDefaultAdd(){
                var that = this
                uni.request({
                    url:'http://'+that.$host+':'+that.$port+'/address/getDefaultAddByUserId?userId='+that.userId,
                    success(res) {
                        console.log(res.data)
                        that.addinfo = res.data.obj
                    }
                })
            },
            toaddadd(){
                uni.navigateTo({
                    url:'/pages/mine/addaddress/addaddress'
                })
            },
            depositSurety(){
                var that = this
                uni.request({
                    url:'http://'+that.$host+':'+that.$port+'/surety/depositSurety',
                    data:{
                        userId:that.userId,
                        goodsId:that.id,
                        addressId:that.addinfo.id
                    },
                    success(res) {
                        uni.showToast({
                            title :'支付成功',
                                
                        })
                      uni.$u.sleep(1500).then(() => {
                          uni.redirectTo({
                              url:'/pages/paiMaiXiangQing/paiMaiXiangQing?id='+that.id
                          })
                      })
                    }
                })
            }
        }
    }
</script>

<style>
 .u-icon /deep/ .u-icon__icon {
    font-weight: 900 !important;
}
</style>
